{% load render_bundle from webpack_loader %}
{% load project_extras %}
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <meta name="robots" content="index, follow, NOODP">
    <meta name="description" content="Smarter Manual Annotation for Resource-constrained collection of Training data (SMART) is a tool that leverages elements of active learning, gamification, and UI/UX design to help data scientists and researchers reduce manual coding time and effort, making machine learning classification tasks more affordable and widely accessible."/>
    <link href="https://fonts.googleapis.com/css?family=Lato|Roboto+Slab" rel="stylesheet">
    {% load static %}
    <link rel="icon" href="{% static 'SMART_logo32x32_bw.ico' %}?v=2" type="image/x-icon" /> 
    <title>{% block page_title %}{% endblock %}</title>
    {% render_bundle 'smart' 'css' %}
    {% block scripts_head %}{% endblock %}
  </head>

  <body>
    <header>
      <a href="/"><img src="{% static 'SMART-logo_shadow_white_horz.png' %}" id="logo"></a> 
      {% if user.is_authenticated %}
        <div class="margin-left">
          {% if project.pk %}
            <div class="btn-group">
              <a role="button" class="btn btn-link" href="{% url 'projects:project_list' %}">Projects</a>
              <a role="button" class="btn btn-link" href="{{ project.get_absolute_url }}">Details</a>
              <a role="button" class="btn btn-link" href="{% url 'projects:project_code' project.pk %}">Annotate</a>
              {% if project|proj_permission_level:request.user.profile > 1 %}
                <a role="button" class="btn btn-link" href="{% url 'projects:project_admin' project.pk %}">Admin</a>
              {% endif %}
            </div>
          {% else %}
            <a role="button" class="btn btn-link" href="/">Projects</a>
          {% endif %}
        </div>
        <div id="user_buttons" class="btn-group">
          <div class="dropdown">
            <button type="button" class="btn btn-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
              {{ user }} <span class="caret"></span>
            </button>
            <ul class="dropdown-menu dropdown-menu-right">
              <li><a href="{% url 'account_email' %}">Manage Emails</a></li>
              <li><a href="{% url 'account_change_password' %}">Manage Password</a></li>
              <li><a href="{% url 'account_logout' %}">Logout</a></li>
            </ul>
          </div>
        </div>
      {% endif %}
    </header>

    <div class="content-wrapper">
      {% if messages %}
        <div class="messages">
        {% for message in messages %}
          <div class="alert alert-warning alert-dismissible" role="alert">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
            {{message}}
          </div>
        {% endfor %}
        </div>
      {% endif %}

      <main class="container-fluid">
      {% block content %} {% endblock %}
      </main>

    </div>
    {% render_bundle 'manifest' 'js' %}
    {% render_bundle 'vendor' 'js' %}
    {% render_bundle 'globals' 'js' %}
    {% block scripts_body %} {% endblock %}
  </body>
</html>
